<template>
  <vxe-table
    id="selectedStudentPatent-table"
    :data="list"
    stripe
    show-overflow
    show-header-overflow
    min-height="0"
    :custom-config="vxeTableConfig"
    :column-config="{ resizable: true }"
    :size="vxeTableSize"
  >
    <vxe-column :title="t('common.index')" type="seq" field="seq" width="60" align="center" />
    <vxe-column
      :title="t('selectedPatent.patentName')"
      field="patentName"
      align="center"
      show-header-overflow
      show-overflow
      min-width="100"
    />
    <vxe-column
      :title="t('selectedPatent.patentStatus')"
      field="patentStatus"
      align="center"
      show-header-overflow
      show-overflow
      min-width="100"
    />
    <vxe-column
      :title="`${t('selectedPatent.publishNumber')}/${t('selectedPatent.patentNumber')}`"
      field="patentNumber"
      align="center"
      show-header-overflow
      show-overflow
      min-width="200"
    >
      <template #default="{ row }">
        <template v-if="row.publishNumber">
          {{ row.publishNumber }}
        </template>
        <template v-if="row.patentNumber">
          {{ row.patentNumber }}
        </template>
      </template>
    </vxe-column>
    <vxe-column
      :title="`${t('selectedPatent.publishTime')}/${t('selectedPatent.patentTime')}`"
      field="patentTime"
      align="center"
      show-header-overflow
      show-overflow
      min-width="200"
    >
      <template #default="{ row }">
        <template v-if="row.publishTime">
          {{ formatDate(row.publishTime) }}
        </template>
        <template v-if="row.patentTime">
          {{ formatDate(row.patentTime) }}
        </template>
      </template>
    </vxe-column>
    <vxe-column
      :title="t('selectedPatent.personalRanking')"
      field="personalRanking"
      align="center"
      show-header-overflow
      show-overflow
      min-width="100"
    />
    <vxe-column
      :title="t('selectedPatent.casRanking')"
      field="casRanking"
      align="center"
      show-header-overflow
      show-overflow
      min-width="150"
    />
    <vxe-column
      :title="t('selectedPatent.imrRanking')"
      field="imrRanking"
      align="center"
      show-header-overflow
      show-overflow
      min-width="150"
    />
    <vxe-column
      :title="t('selectedPatent.attachment')"
      field="attachment"
      align="center"
      show-header-overflow
      show-overflow
      min-width="150"
    >
      <template #default="{ row }">
        <el-button v-if="row.attachment" link type="primary" @click="handlePreview(row.attachment)">
          {{ t('fileObjectDownload.buttonName') }}
        </el-button>
      </template>
    </vxe-column>
  </vxe-table>
</template>

<script setup lang="ts">
import { useAppStore } from '@/store/modules/app'
import { StudentPatentVO } from '@/api/core/studentpatent'
import type { VxeTablePropTypes } from 'vxe-table'
import { formatDate } from '@/utils/formatTime'

defineOptions({ name: 'SelectedPatentTable' })

defineProps<{
  list: StudentPatentVO[]
}>()

const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗

const vxeTableConfig: VxeTablePropTypes.CustomConfig = {
  storage: true,
  mode: 'drawer',
  checkMethod({ column }) {
    return !['seq', 'operator'].includes(column.field)
  }
}

const appStore = useAppStore()
const vxeTableSize = computed(() => appStore.getCurrentSizeVxe)

const emits = defineEmits<{
  (e: 'preview', attachment: string): void
}>()
const handlePreview = (attachment: string) => {
  if (!attachment || attachment === '[]') {
    message.error(t('fileObjectDownload.error'))
    return
  }
  emits('preview', attachment)
}
</script>

<style scoped lang="scss"></style>
